
<template>
  <div class="h100">
    <s-table
      class="h100"
      :columns="columns"
      :data="loadData"
      rowKey="id"
      ref="table"
      :showPagination="false"
    >
      <template
        slot-scope="text"
        v-for="column in columns.filter(item => !item.special)"
        :slot="column.scopedSlots.customRender">
        <table-ellipsis :text="text||'_'" :key="column.dataIndex"></table-ellipsis>
      </template>
      <template #fwgsy="text">
        <table-ellipsis :text="serviceSaleBelongFlagDictCodeObj[text]||'_'"></table-ellipsis>
      </template>
      <template #fwfl="text">
        <table-ellipsis :text="serviceSaleCateFlagDictCodeObj[text]||'_'"></table-ellipsis>
      </template>
      <template #yesNoType="text">
        <table-ellipsis :text="chooseYesNoTypeObj[text]||'_'" ></table-ellipsis>
      </template>
      <template #saleState="text">
        <table-ellipsis :text="saleStateTypeObj[text]||'_'" ></table-ellipsis>
      </template>
      <span
        slot="versionDepend"
        slot-scope="text,record"
        class="tableOperateSty"
      >
        <operation-menu
          :menus="tbRowMenus"
          @clickaction="(key)=>{
            doAction(key,record)
          }"
        ></operation-menu>
      </span>
    </s-table>
    <!-- 版本依赖 -->
    <service-Version-depend :serviceId="serviceId" :modelId="modelId" ref="versionDependRef">
    </service-Version-depend>
    <!-- 查看供应商 -->
    <supplier-view-modal
      :serviceId="serviceId"
      :modelId="modelId"
      ref="supplierRef"
    ></supplier-view-modal>
  </div>

</template>
<script>
import { relatedServiceTbColumns, commonServicesColumns } from '../config/list'
import TableEllipsis from '@/components/Ellipsis/TableEllipsis'
import ServiceVersionDepend from '@/views/components/ServiceVersionDepend.vue'
import SupplierViewModal from '@/views/components/SupplierViewModal.vue'
import { STable } from '@/components'
import { mapState } from 'vuex'
import OperationMenu from '@/components/OperationMenu'

export default {
  props: {
    modelId: {
      type: String,
      default: ''
    }
  },
  components: {
    TableEllipsis,
    STable,
    ServiceVersionDepend,
    SupplierViewModal,
    OperationMenu
  },
  computed: {
    ...mapState({
      instantUpdateTime: (state) => state.app.instantUpdateTime
    }),
    serviceSaleBelongFlagDictCodeObj () {
      return this.$store.getters.getDictCodeObj('serviceSaleBelongFlagDictCode')
    },
    serviceSaleCateFlagDictCodeObj () {
      return this.$store.getters.getDictCodeObj('serviceSaleCateFlagDictCode')
    },
    chooseYesNoTypeObj () {
      return this.$store.getters.chooseYesNoTypeObj()
    },
    saleStateTypeObj () {
      return this.$store.getters.saleStateTypeObj()
    },
    tbRowMenus () {
      const rowMenu = [
        // {
        //   // 版本依赖
        //   title: this.$t('versionDepend'),
        //   key: 'handleVersionDepend'
        // },
        {
          // 供应商
          title: this.$t('supplier'),
          key: 'handleSupplier'
        }
      ]
      return rowMenu
    }
  },
  data () {
    return {
      columns: commonServicesColumns.concat(relatedServiceTbColumns),
      serviceId: ''
    }
  },
  watch: {
    instantUpdateTime: {
      handler () {
        this.refreshData(true)
      },
      immediate: true
    }
  },
  methods: {
    loadData (parameter) {
      const vm = this
      // 如果是全部则不传值给后端
      const JnqueryParam = {}
      JnqueryParam.modelId = vm.modelId
      return vm.$api.getAuditedService({ ...parameter, ...JnqueryParam })
    },
    refreshData (bool = false) {
      this.$refs.table && this.$refs.table.refresh(bool)
    },
    // 列表操作
    doAction (key, record) {
      const vm = this
      vm[key](record)
    },
    handleVersionDepend (record) {
      this.serviceId = record.serviceId
      this.$refs.versionDependRef.visible = true
    },
    handleSupplier (record) {
      this.serviceId = record.serviceId
      this.$refs.supplierRef.visible = true
    }
  }
}
</script>
<style lang="less" scoped></style>
